<template>
    <div>
        <div class="all-page">
            <div class="color-box"></div>
            <span class="advise-text">{{ adviseText }}
            </span>
            <span class="advise-title">AI建议</span>

            <span class="title">诊断结果</span>
            <span class="graph-title">相关知识图谱：</span>
            <div class="graph-module">
                <neo4j-chart :nodes="nodes" :links="links" />
            </div>
        </div>
    </div>
</template>

<script setup>
import Neo4jChart from '../components/Neo4jChart.vue';
import neo4jRequest from '../utils/neo4jRequest';
import request from '../utils/request'
import { onMounted, ref } from 'vue';

let adviseText = ref(' 针对您的高血压问题，以下是一些建议，旨在帮助您更好地管理和控制血压：\
                一、药物治疗选择长效降压药：尽量选择长效的降压药，如转换酶抑制剂、β受体阻滞剂、钙离子拮抗剂或血管紧张素Ⅱ受体拮抗剂等，这些药物可以平稳控制血压，避免血压波动。\
                遵医嘱用药：规律测量血压，并严格按照医生的指导用药，切勿自行增减药量或停药。在季节更替或病情变化时，应咨询医生后再调整药物剂量。\
                二、生活方式调整饮食调整低盐饮食：每日食盐摄入量应控制在6克以下，如果高血压已导致肾损害或肾功能不全，应进一步减少至3克以下。\
                低脂饮食：减少脂肪尤其是饱和脂肪酸和胆固醇的摄入，少吃肥肉、动物内脏等。高纤维素、高维生素\
                饮食：多吃新鲜蔬菜和水果，摄入足够的纤维素和维生素。\
                补充钾和钙：适当多吃富含钾和钙的食物，如豆类、坚果、鱼类等。\
                戒烟限酒：吸烟和过量饮酒都会升高血压，增加心脑血管疾病的风险，因此应戒烟并限制饮酒量。\
                适量运动有氧运动：如慢跑、快走、游泳、太极拳等，每周至少进行3-5次，每次持续30分钟以上。\
                避免清晨和晚间运动：这两个时间段血液粘度较高，容易诱发心脑血管疾病，因此最好选择在上午九至十一点或下午四至六点之间运动。\
                控制体重肥胖是高血压的重要危险因素之一，因此应通过合理的饮食和运动来控制体重。保持情绪平稳长期的焦虑、紧张等情绪会导致血压升高，因此应学会放松自己，保持心情愉悦。')

let nodes = ref([
    { id: "1", name: '暂未查到数据', describe: '暂未查到数据' },
]);
let links = ref([
    { source: "1", target: "2", type: 'Link Type' },
]);

const props = defineProps({
    symptom: {
        type: String,
        required: true
    }
});

onMounted(() => {
    console.log(props.symptom)
    changeSym();
    try {
        request.post("ai/ask", { message: props.symptom }).then((res) => {
            if (res.code === 200) {
                adviseText.value = res.data.message.replace(/\n/g, "<br>");
            } else {
                alert("出错啦");
            }
        });
    } catch (error) {
        // 捕获同步代码块中的错误
        console.error("同步代码块出错：", error);
        alert("同步代码块出错");
    }
    alert('系统正在生成中, 该动作可能耗时较长，请稍后......')
})



function changeSym() {
    neo4jRequest.get("neo4j/findSymptomRelationShips/" + props.symptom).then(res => {
        if (res.code === 200) {
            nodes.value = res.data.node;
            links.value = res.data.path;
        } else {
            alert("查询症状图谱失败");
        }
    })
};

</script>

<style scoped>
* {
    box-sizing: border-box;
}

body {
    font-size: 14px;
}

.all-page {
    width: 100vw;
    height: 95vh;
    background: rgba(50, 73, 94, 1);
    opacity: 1;
    position: absolute;
    left: 0px;
    overflow: hidden;
}


.advise-text {
    width: 720px;
    color: rgba(249, 249, 249, 1);
    position: absolute;
    top: 25vh;
    left: 50vw;
    font-family: Inter;
    font-weight: Regular;
    font-size: 18px;
    opacity: 1;
    text-align: left;
}

.advise-title {
    width: 68px;
    color: rgba(249, 249, 249, 1);
    position: absolute;
    top: 15vh;
    left: 50vw;
    font-family: Inter;
    font-weight: Extra Bold;
    font-size: 22px;
    opacity: 1;
    text-align: left;
}

.color-box {
    width: 100vw;
    height: 10vh;
    background: rgba(72, 100, 125, 1);
    opacity: 1;
    position: absolute;
    top: 0vh;
    left: 0px;
    overflow: hidden;
}

.title {
    width: 176px;
    color: rgba(249, 249, 249, 1);
    position: absolute;
    top: 1.5vh;
    left: 5vw;
    font-family: Inter;
    font-weight: Extra Bold;
    font-size: 44px;
    opacity: 1;
    text-align: left;
}

.graph-title {
    width: 154px;
    color: rgba(255, 255, 255, 1);
    position: absolute;
    top: 15vh;
    left: 5vw;
    font-family: Inter;
    font-weight: normal;
    font-size: 22px;
    opacity: 1;
    text-align: left;
}

.graph-module {
    width: 60vh;
    height: 60vh;
    background: rgba(249, 249, 249, 1);
    opacity: 1;
    position: absolute;
    top: 25vh;
    left: 5vw;
    box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.15000000596046448);
    overflow: hidden;
}
</style>